/** 实现功能： 1、默认情况下只禁止空格输入 2、限制只能输入整数 3、限制只能输入整数和小数（价格类） */
const trigger = (el, type) => {
  const e = document.createEvent('HTMLEvents');
  e.initEvent(type, true, true);
  el.dispatchEvent(e);
};

const intFilter = function (el) {
  // 处理整数输入，去除非数字字符，处理前导零
  el.value = el.value.replace(/\D/g, '').length > 1 ? el.value.replace(/\D|\b(0+)/g, '') : el.value.replace(/\D/g, '');
  // 移除 trigger(el, 'input') 避免死循环
};

const intAZFilter = function (el) {
  // 处理数字和大写字母，去除下划线和特殊字符，限制长度
  el.value = el.value.toUpperCase().replace(/_/g, '').replace(/[\W]/g, '').slice(0, 18);
  // 移除 trigger(el, 'input') 避免死循环
};

const intAzFilter = function (el) {
  // 处理数字和字母（允许小写），去除下划线和特殊字符
  el.value = el.value.replace(/_/g, '').replace(/[\W]/g, '');
  // 移除 trigger(el, 'input') 避免死循环
};

const bankCardFilter = function (el) {
  el.value = el.value.replace(/\D/g, '');
};

const switchfilter = function (el, arg, binding) {
  const changeList = {
    int: intFilter, // 整数类型
    intAZ: intAZFilter, // 数字字母组合（大写）
    intAz: intAzFilter, // 数字字母组合（允许小写）
    bank: bankCardFilter
  };
  changeList[arg]?.(el, binding);
};

const filterFunction = function (el, arg, binding) {
  let doing = false;

  // 处理中文输入组合事件
  el.addEventListener(
    'compositionstart',
    () => {
      doing = true;
    },
    false
  );

  el.addEventListener(
    'keyup',
    () => {
      if (!doing) {
        switchfilter(el, arg, binding);
      }
    },
    false
  );

  el.addEventListener(
    'compositionend',
    () => {
      doing = false;
      setTimeout(() => {
        switchfilter(el, arg, binding);
      }, 10);
    },
    false
  );

  // 增加输入事件监听，处理粘贴等场景
  el.addEventListener(
    'input',
    () => {
      if (!doing) {
        switchfilter(el, arg, binding);
      }
    },
    false
  );
};

export default {
  mounted(el, binding) {
    // 找到实际的 input 或 textarea 元素
    if (el.tagName.toLowerCase() !== 'input' && el.tagName.toLowerCase() !== 'textarea') {
      const input = el.querySelector('input') || el.querySelector('textarea');
      if (input) {
        el = input;
      } else {
        console.warn('v-input-filter 指令只能用于 input 或 textarea 元素');
        return;
      }
    }
    filterFunction(el, binding.arg, binding);
  },

  // 可选：如果需要在指令更新时重新绑定
  updated(el, binding) {
    // 逻辑同 mounted
    if (el.tagName.toLowerCase() !== 'input' && el.tagName.toLowerCase() !== 'textarea') {
      const input = el.querySelector('input') || el.querySelector('textarea');
      if (input) {
        el = input;
      } else {
        return;
      }
    }
    filterFunction(el, binding.arg, binding);
  }
};
